﻿#regist-form {
  background-color: white;
  margin-top: 8rem; }
  #regist-form > .row {
    height: 100%; }

#open-user-info {
  text-align: center;
  opacity: 0;
  transition: all ease-out 0.5s;
  transition: all .5s;
  height: 45rem;
  background-image: url();
  background-repeat: no-repeat;
  background-size: 15px 80%;
  background-position: right center; }
  #open-user-info.enable {
    opacity: 1; }
  #open-user-info:after {
    content: '';
    width: 0;
    height: 100%;
    display: inline-block;
    vertical-align: middle; }
  #open-user-info > div {
    display: inline-block;
    vertical-align: middle; }

#oui-ttl {
  color: #cccccc; }

#open-user-headimg {
  width: 10rem;
  border: 5px solid white;
  box-shadow: 1px 1px 3px 0 gray; }

.slide-fade-enter-active {
  transition: all .5s ease; }

.slide-fade-leave-active {
  transition: all 0.8s cubic-bezier(1, 0.5, 0.8, 1); }

.slide-fade-enter, .slide-fade-leave-active {
  transform: translateY(20px);
  opacity: 0; }

#acnt-info {
  height: 45rem;
  padding: 0 4rem; }
  #acnt-info:after {
    content: '';
    width: 0;
    height: 100%;
    display: inline-block;
    vertical-align: middle; }

#new-acnt-info {
  max-width: 45rem;
  margin: 0 auto; }
  #new-acnt-info i {
    color: #3caed4; }

#nai-steps {
  height: 6rem;
  padding: 2rem 0; }
  #nai-steps > .step {
    background-color: #90d1e6;
    height: 3rem;
    line-height: 3rem;
    font-size: 1.6rem;
    font-weight: bold;
    color: white;
    text-align: center; }
    #nai-steps > .step::after {
      content: ' ';
      border-style: solid;
      border-width: 1.5rem;
      border-color: transparent transparent transparent #90d1e6;
      position: absolute;
      right: -3rem;
      z-index: 1;
      top: 0;
      width: 4px; }
    #nai-steps > .step.active {
      background-color: #3caed4; }
      #nai-steps > .step.active:after {
        border-color: transparent transparent transparent #3caed4; }

#nai-ttl {
  height: 4rem;
  padding: 1rem 0; }
  #nai-ttl > h3 {
    border-left: 5px solid;
    text-indent: 10px; }

#nai-fields {
  height: 26rem; }

.ipt-captcha {
  margin-top: 6rem; }
  .ipt-captcha > input {
    padding-right: 40%;
    letter-spacing: 5px; }
  .ipt-captcha > button {
    position: absolute;
    right: 0;
    top: 0;
    width: 40%; }

#new-acnt-tip {
  right: 5px;
  color: #65ce7e; }
  #new-acnt-tip.fail {
    color: #c51e32; }
    #new-acnt-tip.fail > i:before {
      color: #c51e32; }
  #new-acnt-tip > i:before {
    color: #65ce7e; }

#new-passconfirm-tip {
  right: 5px;
  color: #c51e32; }
  #new-passconfirm-tip > i:before {
    color: #c51e32; }

#new-acnt-vertify {
  font-size: 2rem;
  width: 50%; }

#new-acnt-cancel {
  font-size: 2rem;
  width: 30%;
  margin-right: 1rem; }

#new-acnt-submit {
  font-size: 2rem;
  width: 50%; }
